<!-- 报修人员工单列表界面 -->
<template>
	<view>
		<!-- 工单列表顶部界面 -->
		<view class="orderList-top">
			<view class="orderList-top-listItem">
				<view class="orderList-top-listItem-title">
					全部
				</view>
				<view class="orderList-top-listItem-item">
					<text>收到的</text>
					<text>待审核的</text>
					<text>已审核的</text>
				</view>
			</view>
			<view class="orderList-top-listItem">
				<view class="orderList-top-listItem-title">
					全部
				</view>
				<view class="orderList-top-listItem-item">
					<text>待接单</text>
					<text>待回单</text>
					<text>处理中</text>
					<text>已拒绝</text>
				</view>
			</view>
			<view class="orderList-top-listItem">
				<view class="orderList-top-listItem-title">
					全部
				</view>
				<view class="orderList-top-listItem-item">
					<text>今天</text>
					<text>昨天</text>
					<text>一周</text>
					<text>一月</text>
				</view>
			</view>
		</view>
		<view style="margin-top: 15rpx;">
			<uni-card>
				<uni-data-checkbox v-model="value1" :localdata="range1" @change="change1" mode=tag selectedColor="orange"></uni-data-checkbox>
				<uni-data-checkbox v-model="value2" :localdata="range2" @change="change2" mode=tag selectedColor="orange"></uni-data-checkbox>
				<uni-data-checkbox v-model="value3" :localdata="range3" @change="change3" mode=tag selectedColor="orange"></uni-data-checkbox>
			</uni-card>
			<workOrderIntroduce  :intro="myIntro"></workOrderIntroduce>
		</view>
	</view>
</template>

<script>
	import workOrderIntroduce from '../../../componentB/maintenanceCenter/workOrderIntroduce/workOrderIntroduce.vue'
	export default {
		components: {
			workOrderIntroduce,
		},
		data() {
			return {
				value1: 0,
				range1: [{"value": 0,"text": "全部"   },{"value": 1,"text": "发起"   },{"value": 2,"text": "收到"   },{"value": 3,"text": "待审核"   },{"value": 4,"text": "已审核"}   ],
				value2: 0,
				range2: [{"value": 0,"text": "全部"    },{"value": 1,"text": "待接单"    },{"value": 2,"text": "待回单"    },{"value": 3,"text": "处理中"    },{"value": 4,"text": "已拒绝"    }],
				value3: 0,
				range3: [{"value": 0,"text": "全部"    },{"value": 1,"text": "今天"    },{"value": 2,"text": "昨天"    },{"value": 3,"text": "一周"    },{"value": 4,"text": "一个月"    }],
				myIntro: [{
					date: "09" + "-" + "29",
					num: "20190606",
					person: "赵芳舟",
					condition: "已派工",
					bool_condition: true,
					pic_url: "http://p1362.bvimg.com/10465/c3a9c337f395eaf7.png",
					campus: "屏峰校区",
					building: "家和西苑13号",
					roomNo: "701",
					Info: "寝室阳台关不上，厕所门掉了，灯时而闪，床塌了，地砖裂了，电风扇没风扇，空调坏了，墙皮没了"
				},
				{
					date: "09" + "-" + "29",
					num: "20190606",
					person: "赵芳舟",
					condition: "已派工",
					bool_condition: true,
					pic_url: "http://p1362.bvimg.com/10465/c3a9c337f395eaf7.png",
					campus: "屏峰校区",
					building: "家和西苑13号",
					roomNo: "701",
					Info: "寝室阳台关不上，厕所门掉了，灯时而闪，床塌了，地砖裂了，电风扇没风扇，空调坏了，墙皮没了"
				},
				{
					date: "09" + "-" + "29",
					num: "20190606",
					person: "赵芳舟",
					condition: "已派工",
					bool_condition: false,
					pic_url: "http://p1362.bvimg.com/10465/c3a9c337f395eaf7.png",
					campus: "屏峰校区",
					building: "家和西苑13号",
					roomNo: "701",
					Info: "寝室阳台关不上，厕所门掉了，灯时而闪，床塌了，地砖裂了，电风扇没风扇，空调坏了，墙皮没了"
				}]
			}
		},
		methods: {
			change1(e){
			    console.log('e:',e);
			},
			change2(e){
				console.log('e:',e);
			},
			change3(e){
				console.log('e:',e);
			}
		}
	}
</script>

<style>
	page {
		background-color: rgb(243, 243, 243);
	}
	.orderList-top{
		padding: 4rpx 14rpx;
		background-color: white;
	}
	.orderList-top-listItem-title{
		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;
		font-weight: bold;
		padding: 2rpx 26rpx;
		color: #3CACFE;
		background-color: #f0f0f0;
		border-radius: 8rpx;
	}
	.orderList-top-listItem{
		display: flex;
		margin: 14rpx 10rpx;
	}
	.orderList-top-listItem-item{
		font-size: 28rpx;
		padding: 10rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		color: #595959;
	}
	.orderList-top-listItem-item text{
		width: 130rpx;
		text-align: center;
	}
</style>
